@charset 'utf-8';
*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

body{
	/*display: -webkit-flex;
	display: flex;*/
	background: #000;
	color: #fff;
}
h1{
	background: #0079bc;
	color: #e8ebcc;
}
nav{
	background: #1e0155;
	position: fixed;
	top: 0;
}
ul{
	display: -webkit-flex;
	display: flex;
	list-style-type: none;
}
li{
	border:1px solid #fff;
	padding: 5px 10px;
}
a{
	color: #f00;
	font-size:20px;
	font-weight: bold;
	text-decoration:none;
}
a:hover{
	color: #399f14;
}
span{
	width: 50px;
	height: 50px;
	background: #d63200;
	border: 1px solid #fff;
}
#menu{
	position: fixed;
	right: 0;
	background: #399f14;
	z-index: 100;
}
#menu:hover{
	color: #14469f;
	cursor: pointer;
}
.title{
	background:#50003b;
	color: #b07e25;
	padding: 5px 15px;
}
.body{
	display: -webkit-flex;
	display: flex;
	height: 150px;
	background: #537384;
}
.row{
	flex-direction: row;
}
#row-reverse + div{
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
#column + div{
	-webkit-flex-direction: column;
	flex-direction: column;
}
#column-reverse + div{
	-webkit-flex-direction: column-reverse;
	flex-direction: column-reverse;
}
#nowrap + div{
	-webkit-flex-wrap: nowrap; /* Safari */
	 flex-wrap:        nowrap;
}
#wrap + div{
	-webkit-flex-wrap: wrap; /* Safari */
	 flex-wrap:        wrap;
}
#wrap-reverse + div{
	-webkit-flex-wrap: wrap-reverse; /* Safari */
	 flex-wrap:        wrap-reverse;
}
#flex-start + div{
	-webkit-justify-content: flex-start; /* Safari */
  justify-content:         flex-start;
}
#flex-end + div{
	-webkit-justify-content: flex-end; /* Safari */
  justify-content:         flex-end;
}
#center + div{
	-webkit-justify-content: center; /* Safari */
  justify-content:         center;
}
#space-between + div{
	-webkit-justify-content: space-between; /* Safari */
  justify-content:         space-between;
}
#space-around + div{
	-webkit-justify-content: space-around; /* Safari */
  justify-content:         space-around;
}
#stretch + div{
	-webkit-align-items: stretch; /* Safari */
  align-items:         stretch;
}
#stretch + div span{
	width: auto;
	height: auto;
}
#align-items-flex-end + div{
	-webkit-align-items: flex-end; /* Safari */
  align-items:         flex-end;
}
#align-items-flex-end + div span{
	width: auto;
	height: auto;
}
#align-items-flex-start + div{
	-webkit-align-items: flex-start; /* Safari */
  align-items:         flex-start;
}
#align-items-flex-start + div span{
	width: auto;
	height: auto;
}
#align-items-center + div{
	-webkit-align-items: center; /* Safari */
  align-items:         center;
}
#align-items-center + div span{
	width: auto;
	height: auto;
}
#baseline + div{
	-webkit-align-items: baseline; /* Safari */
  align-items:         baseline;
}
#baseline + div span{
	width: auto;
	height: auto;
}

#align-content-stretch + div{
	-webkit-align-content: stretch; /* Safari */
  align-content:         stretch;
  flex-wrap: wrap;
}
#align-content-flex-start + div{
	-webkit-align-content: flex-start; /* Safari */
  align-content:         flex-start;
  flex-wrap: wrap;
}
#align-content-flex-end + div{
	-webkit-align-content: flex-end; /* Safari */
  align-content:         flex-end;
  flex-wrap: wrap;
}
#align-content-center + div{
	-webkit-align-content: center; /* Safari */
  align-content:         center;
  flex-wrap: wrap;
}
#align-content-space-between + div{
	-webkit-align-content: space-between; /* Safari */
  align-content:         space-between;
  flex-wrap: wrap;
}
#align-content-space-around + div{
	-webkit-align-content: space-around; /* Safari */
  align-content:         space-around;
  flex-wrap: wrap;
}